<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>学生系统首页</title>
<link rel="stylesheet" href="element-ui/lib/theme-chalk/index.css" />
<script src="js/vue.js"></script>
<script type="text/javascript" src="element-ui/lib/index.js"></script>
</head>
<style>
.el-header{
        background-color: #545c64;
      }
      .header-img{
        width: 100px;
        margin-top: 20px;
      }
</style>
<body>

<div id="sty">
			
		<el-container>
		<!-- 头部部分 -->
		  <el-header>
		  <el-container>
		   <div>
            <el-image src="img/export.png" class="header-img"></el-image>
          </div>
	      <el-menu
            
            mode="horizontal"
           
            background-color="#545c64"
            text-color="white"
            active-text-color="#ffd04b"
            style="margin-left: auto;">
            <el-menu-item index="1">处理中心</el-menu-item>
            <el-submenu index="2">
              <template slot="title">我的工作台</template>
              <el-menu-item index="2-1">选项1</el-menu-item>
              <el-menu-item index="2-2">选项2</el-menu-item>
              <el-menu-item index="2-3">选项3</el-menu-item>
            </el-submenu>
            <el-menu-item index="3"><a href="stuList.html" target="_self">首页</a></el-menu-item>
          </el-menu>
        </el-container>
		  
		  </el-header>
	  <el-container>
		  <!-- 侧边栏部分 -->
		    <el-aside width="200px">
   
		    
		          <el-menu
      default-active="2"
      class="el-menu-vertical-demo"
      background-color="#545c64"
      text-color="#fff"
      active-text-color="#ffd04b"
      :default-openeds="['1']">
      <el-submenu index="1">
         <template slot="title"> <i class="el-icon-menu"></i>学工部</template>
        <el-menu-item-group>
            <el-menu-item index="1-1"> <i class="el-icon-help" @click="findAll"></i>在校学生管理</el-menu-item>
          <el-menu-item index="1-2"> <i class="el-icon-help"></i>学生升级/留级情况</el-menu-item>
          <el-menu-item index="1-3"> <i class="el-icon-help"></i>学生就业情况</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
      
        <el-submenu index="2">
         <template slot="title"> <i class="el-icon-menu"></i>咨询部</template>
        <el-menu-item-group>
            <el-menu-item index="2-1"> <i class="el-icon-help"></i>意向报名学生</el-menu-item>
          <el-menu-item index="2-2"> <i class="el-icon-help"></i>未报名学生管理</el-menu-item>
          <el-menu-item index="2-3"> <i class="el-icon-help"></i>已报名学生管理</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
      
      
        <el-submenu index="3">
                    <template slot="title"><i class="el-icon-menu"></i>教研部</template>
                    <el-menu-item-group>
                      <el-menu-item index="3-1"><i class="el-icon-help"></i>已有课程管理</el-menu-item>
                      <el-menu-item index="3-2"><i class="el-icon-help"></i>正在研发课程管理</el-menu-item>
                      <el-menu-item index="3-3"><i class="el-icon-help"></i>新技术课程管理</el-menu-item>
                    </el-menu-item-group>
                  </el-submenu>
  </el-col>
</el-row>
 
		    </el-aside>
		    <el-container>
		       
		    <!-- 主部分 -->
		      <el-main>    	 
		  <iframe :src="iframeSrc" frameborder="false" style="top:80px;left: 120px; width: 100%;height:500px"></iframe>	      
		      </el-main>
		      
		      
		      <!-- 底部部分 -->
		      <el-footer>
		      底部区域还没有想好
		      </el-footer>
		    </el-container>
		  </el-container>
		</el-container>
		
		</div>


<script>
		
		 new Vue({
		        el:"#sty",
		        data: {
		            iframeSrc: "manager.html"
		        },
		        methods:{
		            findAll:function () {
		                this.iframeSrc = "stuList.html"
		            }
		        }
		    });
		</script>

</body>
</html>